@charset "utf-8";
.slide .swiper-slide .info{ padding: 0 48px}
.slide .swiper-slide .info .group-1 .cn{ font-size: 18px;}
.slide .swiper-slide .info .group-1 .en{ font-size: 12px;}
.slide .swiper-slide .info .group-2 .en{ font-size: 60px;}
.slide .swiper-slide .info .group-2 .cn{ font-size: 40px;}
.slide .swiper-slide .info .group-3 .hotline{ font-size: 24px;}
.row{ padding-right: 48px; padding-left: 48px}
.case{ padding: 80px 0;}
.case .row-title{ padding-right: 48px; padding-left: 48px;}
.case-button{ right: 48px;}
.footer{ padding: 0 48px;}

/* sub */
.column{ padding-right: 48px; padding-left: 48px;}

@media screen and (max-width: 1280px) {
  .nav-list{ font-size: 14px;}
  .nav-list li a{ padding: 0 1em}
  .slide .swiper-slide .info .group-2{ padding: 20px 0 40px}

  /* sub */
  .column{ padding: 60px 48px;}
}
@media screen and (max-width: 1024px) {
  .header{ padding: 5px; height: 50px;}
  .header .logo{ height: 40px;}
  .header .menu{ display: block; font-size: 0; width: 40px; height: 40px; background-position: center center;}
  .header .hotline,
  .header .navgation{ display: none;}
  .slide{ height: 100vw; margin-top: 50px;}

  .slide .swiper-slide .info{ padding: 0 4vw}

  .slide .swiper-slide .info .group-1{ padding-top: 10vw;}
  .slide .swiper-slide .info .group-1 .cn{ font-size: 14px;}
  .slide .swiper-slide .info .group-1 .en{ font-size: 8px;}
  
  .slide .swiper-slide .info .group-2{ padding: 4vw 0;}
  .slide .swiper-slide .info .group-2 .en{ font-size: 24px;}
  .slide .swiper-slide .info .group-2 .cn{ font-size: 20px;}
  
  .slide .swiper-slide .info .group-3 .hotline,
  .slide .swiper-slide .info .group-3 .hotline i{ font-size: 16px;}

  .slide .button{ display: none;}

  .slide .pagination{ bottom: 2vw; left: 0; width: 100%; text-align: center; font-size: 0;}
  .slide .pagination span{ float: none; display: inline-block; margin: 0 2vw!important;}

  .column{ width: 100% !important;}

  .row{ padding: 8vw 4vw;}
  .row-title{ width: 100% !important;}
  .row-title .en{ font-size: 20px; line-height: 1.5;}
  .row-title .cn{ font-size: 18px; line-height: 1.5;}
  .row-title .cn:before{ width: 3vw; left: -4vw; height: 3px;}

  .row-title .more{ top: auto; height: auto; padding: 0; border: none; color: var(--color-theme); font-size: 12px; line-height: 2;}

  .row-title .category{ position: relative; padding-top: 4vw;}
  .row-title .category a{ width: 25%; padding: 0; margin: 0; text-align: center; color: var(--color-theme);}

  .row-content{ width: 100% !important; padding-top: 5vw;}

  .about .row-content{ flex-flow: column nowrap; background-position: right 60vw; background-size: 15%;}
  .about .row-content .cover{ width: 100%;}
  .about .row-content .cover:after{ display: none;}

  .cover-list .swiper-slide a .thumb{ height: 100vw;}
  .cover-list .button{ display: none;}

  .about .row-content .infomation{ width: 100%; padding-top: 6vw;}
  .about .row-content .infomation .line{ height: 2px; margin: 4vw 0;}

  .about .row-content .infomation .more{ margin-top: 8vw; font-size: 14px;}

  .about .row-content .number{ display: none;}

  .album-list .swiper-slide .thumb{ height: 51.75vw;}

  .product-list .swiper-slide a .thumb{ height: 44vw;}
  .product-list .swiper-slide a .info{ font-size: 14px;}

  .case .row-title{ padding: 0;}
  .case-button{ right: 0;}
  .case-list .swiper-slide .thumb{ height: 51.75vw;}

  .news-list .swiper-slide a .info{ padding: 3vw 0;}
  .news-list .swiper-slide a .info .caption{ font-size: 14px; margin-bottom: 0.5em;}
  .news-list .swiper-slide a .info .desc{ font-size: 12px; line-height: 1.5; -webkit-line-clamp:2}
  .news-list .swiper-slide a .info .date{ font-size: 13px; margin-top: .5em;}

  .contact .row-content{ flex-flow: column nowrap;}
  .contact .row-content #map{ width: 100%; height: 50vw;}
  
  .contact-list{ width: 100%; padding: 4vw 0;}
  .contact-list dt{ padding-bottom: 2vw;}
  .contact-list dt strong{ font-size: 18px;}
  .contact-list dt i{ font-size: 12px;}
  .contact-list dd a{ width: 36px; height: 36px; font-size: 14px; line-height: 36px}

  .qcode-list{ display: none;}

  .footer{ padding: 0 4vw; border: none;}
  .copyright{ width: 100% !important; font-size: 12px; text-align: center;}
  .copyright:after{ float: none; display: block;}

  .navgation-fixed{ padding-top: 50px; align-items: flex-start;}
  .navgation-fixed .close{ top: 2vw; right: 2vw; width: 40px; height: 40px; padding: 0; font-size: 0;}


  .nav-fixed{ flex-flow: column nowrap; width: 50%;}
  .nav-fixed li>a{ padding: 15px 0; border-bottom: 1px solid #f4f5f6; font-size: 15px; text-align: center;}
  .nav-fixed li dl{ display: none;}

  /* sub */
  .banner{ height: 50vw;}
  .banner .info .en{ font-size: 16px;}
  .banner .info .cn{ padding-bottom: .75em; font-size: 18px;}
  .banner .info .cn:after{ width: auto; height: 1px;}
  .banner .info .slogan{ padding: 1em 0; font-size: 12px; letter-spacing: 0;}
  .column{ padding: 4vw;}
  .page-number{ margin-top: 6vw;}

  .list-album{ grid-gap: 4vw 0; grid-template-columns: repeat(1, 1fr)}

  .list-product{ grid-gap: 4vw; grid-template-columns: repeat(2, 1fr)}
  .list-product li a .info{ padding: .5em 0;}

  .list-news{ grid-gap: 4vw 0; grid-template-columns: repeat(1, 1fr)}

  .list-news li a{ grid-template-columns: 100px 1fr}
  .list-news li a .thumb{ height: 80px;}
  .list-news li a .info .caption{ font-size: 14px;}
  .list-news li a .info .desc{ margin: .25em 0; font-size: 12px; -webkit-line-clamp: 1;}

  .column-title .en{ font-size: 20px;}
  .column-title .cn{ font-size: 16px;}
  .column-title .desc{ position: relative; width: 100%; height: auto; margin-top: 1em;}

  .column-line{ margin: 4vw 0;}

  .column-content{ font-size: 14px;}

  .article-title h1{ font-size: 16px;}

  .article-line{ margin: 4vw 0;}

  .article-content{ font-size: 14px;}
}